<template>
  <el-row class="ad-dashboard">
    <el-col :span="16">
      <div>{{ welcomeSentence }}</div>
      <div class="tip">当前登录时间：{{ new Date() }}</div>
    </el-col>
    <el-col :span="8">
      <div><iframe src="//i.tianqi.com/index.php?c=code&id=12&icon=1&num=3&site=12" allowtransparency="true" width="100%"></iframe></div>
    </el-col>
  </el-row>
</template>

<script setup>
  import { computed } from 'vue'

  const welcomeSentence = computed(() => {
    let sentence = ''
    let now = new Date().getHours()
    if (now > 0 && now <= 6) {
      sentence = '午夜'
    } else if (now > 6 && now <= 11) {
      sentence = '早上'
    } else if (now > 11 && now <= 14) {
      sentence = '中午'
    } else if (now > 14 && now <= 18) {
      sentence = '下午'
    } else {
      sentence = '晚上'
    }
    return sentence + '好，欢迎来到织码考试，一个AI智能考试系统！'
  })
</script>

<style scoped lang="scss">
  .ad-dashboard {
    background-color: #fff;
    margin-bottom: 15px;
    border-radius: 5px;
    padding: 20px;
    .tip {
      margin-top: 10px;
      margin-left: 0px;
      font-size: 14px;
      color: #999;
    }
    iframe {
      border: none;
      height: 50px;
    }
  }
</style>
